﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>流程检查</title>
    <meta charset="UTF-8" />

    <link href="../../../DataUser/Style/ccbpm.css" rel="stylesheet" type="text/css" />
    <link href="../../Style/skin/css/Default.css" rel="stylesheet" />
    <link href="../../Style/skin/adminfont/iconfont.css" rel="stylesheet" />
    <link href="../../scripts/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <script src="../../Scripts/vue.js"></script>
    <style>
        body table tr td{
            padding:10px 10px;
        }
        table thead > tr > th > .cell {
            padding: 10px 10px;
            text-align: left;
        }
    </style>
</head>
<body>

<div class="cc-checkflow" id="app">
    <h2 class="main-cl6">流程检查信息</h2>
    <div id="Msg" class="cc-checkflow-msg"></div>
    <div>
        <el-table :data="tableData"
                  border=border
                  style="width: 100%"
                  :cell-style="tableCellStyle">
            <el-table-column type="index" label="序" width="50"> </el-table-column>
            <el-table-column prop="NodeID"
                             label="节点ID"
                             width="100">
            </el-table-column>
            <el-table-column prop="NodeName"
                             label="节点名称"
                             width="100">
            </el-table-column>
            <el-table-column prop="ChekOption"
                             label="检查内容">
            </el-table-column>
            <el-table-column prop="Msg"
                             label="信息"
                             width="150">
            </el-table-column>
            <el-table-column prop="InfoType"
                             label="状态"
                             width="100">
            </el-table-column>
        </el-table>
    </div>
</div>
<script type="text/javascript" src="../../Scripts/bootstrap/js/jquery.min.js"></script>
<script src="../../Scripts/QueryString.js" type="text/javascript"></script>
<!-- 引用通用的js文件. -->
<script type="text/javascript" src="../../Scripts/config.js"></script>
<script type="text/javascript" src="../../Comm/Gener.js"></script>
<script src="../../Scripts/element/element.js"></script>
<script type="text/javascript">
    new Vue({
        el: '#app',
        data() {
            return {
                tableData: [],
            };
        },
        methods: {
            InitPage() {
                const en = new Entity("BP.WF.Flow", GetQueryString("FK_Flow"));
                const data = en.DoMethodReturnString("DoCheck");
                if (data.indexOf('err@') == 0) {
                    alert(data);
                    return;
                }
                this.handlerResponse(data);
            },
            handlerResponse(rawStr) {
                this.tableData = JSON.parse(rawStr);
                console.log(this.tableData);

            },
            // 改变某一列单元格背景颜色
            tableCellStyle({ row, column, rowIndex, columnIndex }) {
                console.log(row.InfoType);
                let rowColor = {};
                if (columnIndex == 5) {
                    switch (row.InfoType) {
                        case '信息':
                            rowColor.color = ''
                            break;
                        case '警告':
                            rowColor.color = '#dada88'
                            break;
                        case '错误':
                            rowColor.color = 'red'
                            break;
                        case '提示':
                            rowColor.color = 'green'
                            break;
                    }
                }
                return rowColor;
            },
        },
        created: function () {
            this.InitPage();
        },
    })
</script>
</body>
</html>
